<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>用户界面</title>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link
	href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
	rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
<link href="css/indexjsp.css" rel="stylesheet">
<link href="css/111.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet" />
<style>
html, body {
	width: 100%;
	border: 0;
	padding: 0;
	margin: 0;
}

body {
	background-color: #f4f4f4;
	margin: 0px;
	overflow: hidden;
}

.container {
	opacity: 0.8;
	background-color: papayawhip;
}

canvas {
	background-color: papayawhip;
	position: fixed;
	top: 0;
	left: 0;
}

.panel {
	border-radius: 10px;
}
</style>
<script type="text/javascript" src="js/three.min.js"></script>
<script type="text/javascript" src="js/one.js"></script>
</head>
<body>
	<div class="container">
		<nav class="navbar navbar-inverse">
			<div class="container-fluid">
				<div class="collapse navbar-collapse"
					id="bs-example-navbar-collapse-1">

					<ul class="nav navbar-nav">
						<li><a>博客</a></li>
					</ul>

					<ul class="nav navbar-nav navbar-right">
						<li><a href="./wode.jsp">退出</a></li>
					</ul>
				</div>
			</div>
		</nav>
		<div
			class="panel panel-default col-md-6 register-panel col-md-offset-3"
			style="margin-top: 3%;">
			<div class="h1 text-center">&nbsp;&nbsp;&nbsp;User registration</div>
			<div class="panel-body">
				<form class="form-horizontal" action="./MultiPartRegisterSevlet"
					method="post" enctype="multipart/form-data">

					<div class="form-group">
						<label class="control-label col-md-3">用户名</label>
						<div class="col-md-9">
							<input type="text" class="form-control" name="username"
								id="username" placeholder="请输入用户名" />
						</div>
					</div>

					<div class="form-group">
						<label class="control-label col-md-3">密码</label>
						<div class="col-md-9">
							<input type="password" class="form-control" name="pwd"
								placeholder="请输入密码" />
						</div>
					</div>

					<div class="form-group">
						<label class="control-label col-md-3">重新输入密码</label>
						<div class="col-md-9">
							<input type="password" class="form-control" placeholder="请重新输入密码">
						</div>
					</div>

					<div class="form-group">
						<div class="form-group col-md-8">
							<div class="form-group">
								<label class="control-label col-md-5">性别</label>
								<div class="col-md-6">
									<label class="radio-inline"> <input type="radio"
										name="sex" value="M">男
									</label> <label class="radio-inline"> <input type="radio"
										name="sex" value="F">女
									</label>
								</div>
							</div>
							<label class="control-label col-md-5">上传头像</label>
							<div class="col-md-6">
								<input type="file" name="file" class="form-control"
									id="imageuploader">
							</div>
						</div>
						<div class="col-md-4">
							<img alt="" src="./img/timg.jpg" id="previewer" height="100px"
								width="100px" class="img-circle" style="margin-left: 50px;">
						</div>
					</div>

					<div class="form-group">
						<label class="control-label col-md-3">兴趣爱好</label>
						<div class="col-md-9">
							<select multiple name="interests" class="form-control">
								<option value="books">看书</option>
								<option value="balls">打球</option>
								<option value="music">音乐</option>
							</select>
						</div>
					</div>

					<!-- 验证码 -->
					<div class="form-group">
						<label class="control-label col-md-3">验证码</label>
						<div class="col-md-4">
							<input type="text" class="form-control" name="Vcode" id="yan">
						</div>
						<div class="col-md-4 col-md-offset-1">
							<img alt="" src="./VcodeServlet" onclick="ss()" />
						</div>
					</div>

					<div class="form-group">
						<div class="col-md-offset-3 col-md-9">
							<button type="submit" class="btn btn-primary btn-block">提交</button>
						</div>
					</div>

				</form>
			</div>
		</div>
	</div>

	<script type="text/javascript">
		var imageuploader = document.getElementById('imageuploader');
		var previewer = document.getElementById('previewer');
		imageuploader.onchange = function() {
			var selectedFile = this.files[0];
			var reader = new FileReader();
			reader.onload = function() {
				previewer.src = reader.result;
			}
			reader.readAsDataURL(selectedFile);
		}

		function ss() {
			var pic = document.getElementsByTagName("img");
			pic[1].src = "./VcodeServlet" + "?id=" + Math.random();
		}
	</script>
	<script type="text/javascript">
		var container;
		var camera, scene, projector, renderer;

		var PI2 = Math.PI * 2;
		var radius = 600;
		var theta = 0;
		var programFill = function(context) {

			context.beginPath();
			context.arc(0, 0, 1, 0, PI2, true);
			context.closePath();
			context.fill();

		}

		var programStroke = function(context) {

			context.lineWidth = 0.05;
			context.beginPath();
			context.arc(0, 0, 1, 0, PI2, true);
			context.closePath();
			context.stroke();

		}

		var mouse = {
			x : 0,
			y : 0
		}, INTERSECTED;

		init();
		animate();
	</script>
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
	<script type="text/javascript" src="javascripts/register.js"></script>
</body>
</html>